<template>
  <div class="panel-wrapper">
    <div class="title-box">
      <div class="content g-flex-sb">
        <span>{{titleArr[0] || ''}}</span>
        <span>{{titleArr[1] || ''}}</span>
      </div>
      <img class="tail-icon" :src="titleIcon"/>
    </div>
    <div class="content-box">
      <slot></slot>
    </div>
  </div>
</template>
<script>
import {ossUrl} from '@/utils/config'
export default {
  props: {
    title_left: {
      type: String,
      default: '竞争力分析'
    },
    title_right: {
      type: String,
      default: '近30天'
    },
    titleArr: {
      type: Array,
      default: () => []
    }
  },
  data(){
    return {
      titleIcon: `${ossUrl}intelligence/ni-panel-tail.png`
    }
  }
}
</script>
<style lang="less" scoped>
.panel-wrapper{
  width: 100%;
  margin-bottom: 40px;
  .title-box{
    position: relative;
    .content{
      height: 70px;
      background: rgba(75, 126, 254, 0.15);
      padding: 0 36px;
      border-radius: 5px;
    }
    .tail-icon{
      width: 35px;
      height: 20px;
      margin-left: 45px;
    }
  }
}
</style>